<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>广场</title>
    <!--百度图标-->
    <link rel="shortcut icon" href="img/square/icon/BaiDu-title.png" type="image/x-icon">
    <!--css样式-->
    <link rel="stylesheet" href="css/square.css">
    <!--获取 fontSize-->
    <script type="text/javascript" src="asset/getFontSize.js"></script>
</head>
<body>
<!--广场-->
<header class="square">
    <!--广场 标题-->
    <h3 class="square-title">
        <a href="index.html">
            <img src="img/square/icon/return-icon.png" alt="返回" class="square-return">
        </a>
        广场
    </h3>
    <!--功能 channel  -->
    <div class="channel-line">
        <div class="channel">
            <a href="">
                <img src="img/square/icon/news.jpg" alt="新闻" class="channel-icon">
                <p class="channel-text">新闻</p>
            </a>
        </div>
        <div class="channel">
            <a href="">
                <img src="img/square/icon/fiction-icon.jpg" alt="小说" class="channel-icon">
                <p class="channel-text">小说</p>
            </a>
        </div>
        <div class="channel">
            <a href="">
                <img src="img/square/icon/video-icon.jpg" alt="视频" class="channel-icon">
                <p class="channel-text">视频</p>
            </a>
        </div>
        <div class="channel">
            <a href="">
                <img src="img/square/icon/map-icon.jpg" alt="新闻" class="channel-icon">
                <p class="channel-text">地图</p>
            </a>
        </div>
        <div class="channel">
            <a href="">
                <img src="img/square/icon/PostBar-icon.jpg" alt="贴吧" class="channel-icon">
                <p class="channel-text">贴吧</p>
            </a>
        </div>
    </div>
    <div class="channel-line">
        <div class="channel">
            <a href="">
                <img src="img/square/icon/image-icon.jpg" alt="图片" class="channel-icon">
                <p class="channel-text">图片</p>
            </a>
        </div>
        <div class="channel">
            <a href="">
                <img src="img/square/icon/music-icon.jpg" alt="音乐" class="channel-icon">
                <p class="channel-text">音乐</p>
            </a>
        </div>
        <div class="channel">
            <a href="">
                <img src="img/square/icon/hear-icon.jpg" alt="畅听" class="channel-icon">
                <p class="channel-text">畅听</p>
            </a>
        </div>
    </div>
</header>
<!--本地服务-->
<div class="local-service">
    <h3 class="local-service-title">本地服务</h3>
    <!--广告 advertising -->
    <div class="advertising-top">
        <!--左边-->
        <a href="">
            <div class="advertising-left">
                <img src="img/square/img/move-img.jpg" alt="电影" class="advertising-img">
                <!--电影 介绍 introduce-->
                <div class="advertising-introduce">
                    <p class="advertising-title">热门电影</p>
                    <p class="advertising-p">新片上映抢先看</p>
                </div>
            </div>
        </a>
        <!--右边-->
        <a href="">
            <div class="advertising-left advertising-right">
                <img src="img/square/img/food-img.jpg" alt="电影" class="advertising-img">
                <!--电影 介绍 introduce-->
                <div class="advertising-introduce">
                    <p class="advertising-title">美食到家</p>
                    <p class="advertising-p">新人专享优惠不停</p>
                </div>
            </div>
        </a>
    </div>
    <!--广告 advertising -->
    <div class="advertising-bottom">
        <!--左边-->
        <a href="">
            <div class="advertising-left">
                <img src="img/square/img/doctor-img.jpg" alt="健康" class="advertising-img">
                <!--电影 介绍 introduce-->
                <div class="advertising-introduce">
                    <p class="advertising-title">专家问诊</p>
                    <p class="advertising-p">健康每一天</p>
                </div>
            </div>
        </a>
        <!--右边-->
        <a href="">
            <div class="advertising-left advertising-right">
                <img src="img/square/img/AirTicket-img.jpg" alt="机票" class="advertising-img">
                <!--电影 介绍 introduce-->
                <div class="advertising-introduce">
                    <p class="advertising-title">特价机票</p>
                    <p class="advertising-p">机票1折起</p>
                </div>
            </div>
        </a>
    </div>
</div>
<!--热门 推荐-->
<div class="hot-recommend">
    <h3 class="hot-recommend-title">热门推荐</h3>
    <!--百度 招聘 recruitment -->
    <div class="recruitment">
        <img src="img/square/img/recruitment-img.jpg" alt="招聘" class="recruitment-img">
        <!--百度 招聘-->
        <div class="recruitment-introduce">
            <p class="hot-recommend-introduce-title">百度百聘</p>
            <p class="hot-recommend-text">专业招聘搜索引擎，求职更简单</p>
            <p class="hot-recommend-text">3000万人都在用的求职神器！</p>
        </div>
    </div>
    <!--百度 阅读-->
    <div class="read">
        <img src="img/square/img/read-img.jpg" alt="阅读" class="read-img">
        <!--百度 阅读-->
        <div class="read-introduce">
            <p class="hot-recommend-introduce-title">百度阅读</p>
            <p class="hot-recommend-text">正版图书小说免费阅读平台，让时间更有价值</p>
            <p class="hot-recommend-text">海量最优免费资源，代金券、阅读特权来就送</p>
        </div>
    </div>
</div>
<!--更多 请期待-->
<footer class="Please-Wait">
    更多内容敬请期待
</footer>
</body>
</html>